﻿@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>MultiImages</title>
    <link href="~/Content/css/zyUpload.css" rel="stylesheet" />
    <script src="~/Content/js/jquery-1.8.2.js"></script>
</head>
<body>
    <div id="preview" class="upload_preview">
        <div id="uploadList_0" class="upload_append_list">
            <div class="file_bar file_hover">
                <div style="padding: 5px;">
                    <p class="file_name">angry.gif</p>
                    <span class="file_del" data-index="0" title="删除"></span>
                </div>
            </div>
            <a style="height: 100px; width: 120px;" href="#" class="imgBox">
                <div class="uploadImg" style="width: 105px">
                    <img id="uploadImage_0" class="upload_image" src="~/Content/images/1347110395161.jpg" style="width: 105px;">
                </div>
            </a>
            <p id="uploadProgress_0" class="file_progress"></p>
            <p id="uploadFailure_0" class="file_failure">上传失败，请重试</p>
            <p id="uploadSuccess_0" class="file_success" style="display: block;"></p>
        </div>
        <div id="uploadList_1" class="upload_append_list" onmouseover="ImgOver(this);" onmouseout="ImgOut(this);">
            <div class="file_bar">
                <div style="padding: 5px;">
                    <p class="file_name">beiju.gif</p>
                    <span class="file_del" data-index="1" title="删除" onclick="ImgRemove(this);"></span>
                </div>
            </div>
            <a style="height: 100px; width: 120px;" href="#" class="imgBox">
                <div class="uploadImg" style="width: 105px">
                    <img id="uploadImage_1" class="upload_image" src="~/Content/images/1347110395311.jpg" style="width: 105px;">
                </div>
            </a>
            <p id="uploadProgress_1" class="file_progress"></p>
            <p id="uploadFailure_1" class="file_failure">上传失败，请重试</p>
            <p id="uploadSuccess_1" class="file_success"></p>
        </div>
    </div>
    <script type="text/javascript">
        function ImgOver(target) {
            $(target).find(".file_bar").addClass("file_hover");
            //$(target).closest(".file_bar").addClass("file_hover");
        }
        function ImgOut(target) {
            $(target).find(".file_bar").removeClass("file_hover");
            //$(target).closest(".file_bar").addClass("file_hover");
        }
        function ImgRemove(target) {
            $(target).closest(".upload_append_list").remove();
        }
    </script>
</body>
</html>
